<template>
    <div>
        <a-modal v-model="show" :title="form.id?'编辑':'新增'" @ok="handleOk" @cancel="show = false">
            <a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 19 }">
                <a-form-item label="部门名称 ">
                    <a-input v-model="form.deptName" />
                </a-form-item>
                <a-form-item label="父级部门">
                    <a-select v-model="form.parentId" placeholder="选择组织">
                        <a-select-option :value="item.id"
                            v-for="(item,index) in [{id:'',deptName:'无父级部门'},...deptListCopy]" :key="index">
                            {{item.deptName}}</a-select-option>
                    </a-select>
                </a-form-item>
                <a-form-item label="适用组织">
                    <a-select v-model="form.orgId" placeholder="选择组织">
                        <a-select-option :value="item.orgId"
                            v-for="(item,index) in [{orgId:'',orgName:'选择组织'},...orgList]" :key="index">
                            {{item.orgName}}</a-select-option>
                    </a-select>
                </a-form-item>

            </a-form>
        </a-modal>
    </div>
</template>
<script>
    import { message } from 'ant-design-vue';
    import { postDeptAdd, postDeptUpdate } from "@/services"
    export default {
        props: {
            // 组织列表
            orgList: {
                default: () => { },
                type: Array,
            },
            // 部门列表
            deptList: {
                default: () => { },
                type: Array,
            },
        },
        data() {
            return {
                // 是否显示弹框
                show: false,
                // 表单
                form: {
                    deptName: '',
                    operator: '',
                    orgId: '',
                    parentId: '',
                    deptId: '',
                },
                // 部门列表 修改时去掉当前部门
                deptListCopy:[],
            }
        },
        methods: {
            /**
             * 打开弹框
             */
            open(data) {
                this.show = true // 打开弹框
                this.form = this.$options.data().form // 初始化
                if (data?.id) {
                    this.form = data
                    this.form.deptId = data?.id
                    this.form.orgId = data?.orgId ? data?.orgId : ''
                    this.form.parentId = data?.parentId ? data?.parentId : ''
                }
                // 拷贝部门列表
              this.deptListCopy = this.deptList.filter(x=> data?.id != x?.id )
            },
            /**
             * 确认提交
             */
            async handleOk() {
                let { form } = this
                if (form.deptName == '') {
                    return message.warning('请填写部门名称')
                }
                if (form.orgId == '') {
                    return message.warning('请选择组织')
                }
                if (form.deptId) {
                    let res = await postDeptUpdate(this.form)
                    if (res.code == 0) {
                        message.success('修改成功')
                    } else {
                        return message.warning(res?.msg)
                    }
                } else {
                    let res = await postDeptAdd(this.form)
                    if (res.code == 0) {
                        message.success('添加成功')
                    } else {
                        return message.warning(res?.msg)
                    }
                }
                this.show = false
                this.$emit('ok', 1);
            }
        },
    }
</script>